
import { ref, reactive, nextTick } from "vue";
import { deepSearch } from '@/utils/deep.js'
// 基于 "element-plus": "2.7.6" 实现的 usePanel  为防止出错 使用该hook建议锁版本
function usePanel() {
  const expandPathIds = ref([]);
  const maxDeepPath = ref([]);
  const nodeIdMaps = reactive<any>({
  });
  const props = ref({ checkStrictly: false, emitPath: false, multiple: false, expandTrigger: false })
  const panelRef = ref();
  const options = ref([]);
  function setNode(node: any, options: any) {

    Object.keys(options).map(key => {
      const value = options[key];
      node[key] = value;
    })

  }
  // 首先触发checked
  function doCheck(node: any, v: any) {
    const mapNode = nodeIdMaps[node.value];
    if (node.data.disabled) return;
    setNode(mapNode, {
      checked: v,
      indeterminate: false,
    });
    // 下级的checked
    node.children.map((_: any) => {
      if (_.data.disabled) return;
      const mapNode = nodeIdMaps[_.value];
      setNode(mapNode, {
        checked: v
      })
      if (mapNode.isOpenLeaf) {
        doCheck(_, v);
      }
    });

  }
  function syncParent(node: any) {
    let pathNodes = node.pathNodes;
    pathNodes.slice(0, pathNodes.length - 1).map((parent: any) => {
      const checkedNodes = parent.children.filter((node: any) => {
        const mapNode = nodeIdMaps[node.value];
        return mapNode.checked;
      });
      const parentMapNode = nodeIdMaps[parent.value];
      setNode(parentMapNode, {
        checked: checkedNodes.length != 0,
        indeterminate: checkedNodes.length != 0 ? checkedNodes.length != parent.children.length : false
      })
    })
  }

  function getPanel() {
    const ref = panelRef.value;
    return ref;
  }

  // 将点击的节点leaf(激活) 未点击(激活)的节点不会默认勾选下级
  function doLeaf(node: any) {
    const panel = getPanel();
    const diff = panel.menus.length - node.level;
    // 如果点击的级别与panel最大级超过一级，收回panel到点击的下一级
    if (diff > 1) {
      // panel.menus = panel.menus.slice(0, node.level + 1);
      const menu = panel.menuList[0];
      menu && menu.panel.expandNode(node, false);
    }
    const mapNode = nodeIdMaps[node.value];
    // 勾选下级所有节点
    if (!mapNode.isOpenLeaf && !mapNode.indeterminate) {
      doCheck(node, mapNode.checked);
    }
    setNode(mapNode, {
      isOpenLeaf: true
    })

    // 同步 check会早于leaf发生，所以同步写在doLeaf
    syncParent(node);

  }

  function doLevelExand(level: number) {
    expandPathIds.value = [1156, 710000, 719900].slice(0, level) as any;
    nextTick(() => {
      const panel = getPanel();
      const max = level;
      while (level) {
        const menu = panel.menuList[max - level];
        if (menu) {
          const node = menu.nodes[0];
          node && menu.panel.expandNode(node, false);
        }
        level--;
      }
    })

  }


  function getChecks() {
    // 获取第一个菜单
    const regions: any = [];
    deepSearch(options.value, (item: any) => {
      const mapNode = nodeIdMaps[item.id];
      // 选中并且非部分选
      if (!mapNode.indeterminate && mapNode.checked) {
        regions.push(item.id);
        return 'stopnext';
      }
    });
    return regions;
  }
  return {
    getChecks,
    doLevelExand,
    doCheck,
    doLeaf,
    props,
    options,
    maxDeepPath,
    expandPathIds,
    nodeIdMaps,
    panelRef,
  }

}

export { usePanel };
